<template>
	<view>
		<u-navbar
			title="登录"
			leftText="返回"
			:placeholder="true"
			:safeAreaInsetTop="true"
			bgColor="#f8f8f8"
			leftIconSize="42rpx"
			:autoBack="false"
			@leftClick="goHome()"
			:titleStyle="{color:'#333'}"
		>
			<view slot="left">
				<view class="login-return">
					<u-icon name="home" color="#333" :size="42"></u-icon>
					<u-text text="首页" color="#333" :size="28" margin="0 0 0 10rpx"></u-text>
				</view>
			</view>
		</u-navbar>
		
		<view class="login-page">
			<view class="login-page__title">
				<u-text text="微信小程序授权登录" color="#333" :bold="true" :size="28"></u-text>
			</view>
			
			<view class="login-page__avatar">
				<u-avatar :src="userInfo.avatar" :size="160"></u-avatar>
			</view>
			
			<view class="login-page__button">
				<u-button color="#18b566" :throttleTime="500" :customStyle="{width:'400rpx'}" @click="wxLogin()" text="授权登录"></u-button>
			</view>
			
			<!-- <view class="login-page__button u-flex">
				<u-radio-group v-model="isAgreePolicy">
					<u-checkbox
						activeColor="rgb(24, 181, 102)"
						:labelSize="24"
						shape="circle"
						:size="28"
					>
					</u-checkbox>			
				</u-radio-group>
				<view>
					<text>勾选即表示您同意</text>
					<uni-link href="" text="用户协议">用户协议</uni-link>
					<text>和</text>
					<uni-link href="" text="用户协议">用户协议</uni-link>
				</view>
			</view> -->
		</view>

		<ftx-footer></ftx-footer>
	</view>
</template>

<script>
	import { mpLogin,mpLoginFake } from '@/api/api.js'
	
	export default {
		data() {
			return {
				userInfo: uni.getStorageSync('ftxUserInfo') || {},
				isAgreePolicy: true
			}
		},
		methods: {
			goHome: function() {
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			wxLogin: function() {
				let isAgree = uni.getStorageSync('__IS_AGREEN_PRIVACY__')
				if ( !isAgree ) {
					uni.showModal({
						title: '提示',
						content: '您需要同意用户协议和隐私政策（详见页面底部导航）才可以使用完整服务。',
						confirmText: '同意协议', 
						success(res) {
							if (res.confirm) {
								uni.setStorageSync('__IS_AGREEN_PRIVACY__' , true)
								isAgree = true
								return uni.navigateTo({
									url: '/pagesA/pages/agreement/agreement'
								})
							}
						}
					})
				}
				if ( !isAgree ) {
					return console.log('不同意')
				}
				
				// 模拟登录 仅仅本地编译测试时有效
				// #ifdef H5
				uni.showLoading({
					title: '登录中'
				})
				mpLoginFake().then(res => {
					uni.hideLoading()
					
					uni.setStorageSync('ftxUserInfo' , res.data)
					uni.setStorageSync('ftxToken' , res.data.token)
				
					let mobile = res.data.mobile || ''
					// 登录成功且已经绑定了手机号码
					if ( mobile ) {
						uni.setStorageSync('ftxUserId' , res.data.uid)
						uni.showToast({
							title: "登录成功",
							icon: "none"
						})
						
						setTimeout(function(){
							uni.switchTab({
								url: '/pages/my/my'
							})
						},2000)
					}
					// 新注册或未绑定手机号
					else {
						uni.showModal({
							title: '提示',
							content: '根据国家相关规定，登陆需要绑定手机号',
							confirmText: '去绑定', 
							success(res) {
								if (res.confirm) {
									uni.navigateTo({
										url: '/pages/my/editInfo?fromtype=login'
									})
								}
							}
						})
					}
				})
				// #endif
				
				// #ifdef MP
				// 如果跳出绑定手机号界面但是用户没有去绑定
				// 此时用户本地信息已经缓存过了，只是没有存储ftxUserId信息
				// 再次点击授权登录时直接判断有没有绑定手机号，如果没有绑定则再次询问是否绑定手机号
				if ( this.userInfo.mobile != undefined ) {
					if ( !this.userInfo.mobile ) {
						return uni.showModal({
							title: '提示',
							content: '根据国家相关规定，登陆需要绑定手机号',
							confirmText: '去绑定', 
							success(res) {
								if (res.confirm) {
									return uni.navigateTo({
										url: '/pages/my/editInfo?fromtype=login'
									})
								}
							}
						})
					}
				}
				
				uni.showLoading({
					title: '登录中'
				})
				uni.login({
					provider: 'weixin',
					onlyAuthorize: true,
					success: function(res) {
						mpLogin({code:res.code}).then(res => {
							uni.hideLoading()
							
							uni.setStorageSync('ftxUserInfo' , res.data)
							uni.setStorageSync('ftxToken' , res.data.token)

							let mobile = res.data.mobile || ''
							// 登录成功且已经绑定了手机号码
							if ( mobile ) {
								uni.setStorageSync('ftxUserId' , res.data.uid)
								uni.showToast({
									title: "登录成功",
									icon: "none"
								})
								
								setTimeout(function(){
									return uni.switchTab({
										url: '/pages/my/my'
									})
								},2000)
							}
							// 新注册或未绑定手机号
							else {
								uni.showModal({
									title: '提示',
									content: '根据国家相关规定，登陆需要绑定手机号',
									confirmText: '去绑定', 
									success(res) {
										if (res.confirm) {
											return uni.navigateTo({
												url: '/pages/my/editInfo?fromtype=login'
											})
										}
									}
								})
							}
						})
					},
					fail(error) {
						console.log(error)
						uni.showToast({
							title: '授权失败',
							duration: 2000
						})
					}
				})
				// #endif
			}
		}
	}
</script>

<style lang="scss" scoped>
.login-return {
	@include flex;
}
.login-page {
	@include flex;
	margin-top: 44rpx;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	&__avatar {
		margin: 80rpx 0;
	}
}
</style>
